@extends('layouts.app')
@section('title', '商品列表界面')

@section('content')
    <div class="tt-tab-wrapper">
        <div class="row products-list">
            @foreach($products as $product)
                <div class="product-item col-6 col-sm-3" style="position: relative;">
                    <a href="{{ route('product.show', ['product' => $product->id]) }}" style="text-decoration: none;">
                        <div class="product-content card">
                            <img style="max-height: 200px" src="{{ $product->image_url }}" class="card-img-top" alt="{{ $product->title }}">
                            <div style="height: 50px;margin: 5px 8px 20px 8px;">
                                <div style="display: flex; justify-content: space-between;">
                                    <h5 class="card-title title"><b>{{ $product->title }}</b></h5>
                                    <p class="price" style="color: red">起拍价: {{ $product->price }}</p>
                                </div>
                                <p style="color: #8D8D8D; font-size: 14px;">时间: {{ $product->start_at->format('m-d H:i:s') . '~' . $product->end_at->format('m-d H:i:s')}}</p>
                            </div>
                        </div>
                    </a>
                    <span class="badge badge-danger" style="position: absolute; top: 20px; right: 5px;">竞拍热度: {{$product->people_count}}</span>
                </div>
            @endforeach
        </div>
    </div>
@endsection